<template>
	<!--需要固定宽高滚动在页面层使用scroll-view即可-->
	<view
		class="tui-table__box"
		:style="{
			borderTop:borderTop? `${borderWidth} solid ${borderColor}`:'0',
			borderLeft:borderLeft? `${borderWidth} solid ${borderColor}`:'0',
			borderBottom: borderBottom ? `${borderWidth} solid ${borderColor}` : '0',
			borderRight: borderRight ? `${borderWidth} solid ${borderColor}` : '0'
		}"
	>
		<slot></slot>
	</view>
</template>

<script>
//字体/背景等配置
export default {
	name: 'tuiTable',
	props: {
		//border width 不需要border传0即可
		borderWidth: {
			type: String,
			default: '1rpx'
		},
		//border color
		borderColor: {
			type: String,
			default: '#EAEEF5'
		},
		//是否需要上边框
		borderTop: {
			type: Boolean,
			default: true
		},
		//是否需要左边框
		borderLeft: {
			type: Boolean,
			default: true
		},
		//是否需要下边框
		borderBottom: {
			type: Boolean,
			default: false
		},
		//是否需要右边框
		borderRight: {
			type: Boolean,
			default: false
		}
	},
	data() {
		return {};
	}
};
</script>

<style scoped>
.tui-table__box {
	font-size: 0;
	box-sizing: border-box;
}
</style>